<!DOCTYPE html>
<html>
<head>
	<title>XXXX商城</title>
	<meta charset="utf-8" /> 
	<link href="./css/slider.css" rel="stylesheet" type="text/css">
	<link href="./css/common.css" rel="stylesheet" type="text/css">
	<link href="./css/index.css" rel="stylesheet" type="text/css">
	<script type="text/javascript" src="./js/jquery.js"></script>
	<style type="text/css">
		.header {
			margin-bottom: 0px;
		}
	</style>
	<script type="text/javascript">
		$().ready(function() {

			var $productCategoryMenuItem = $("#productCategoryMenu li");

			$productCategoryMenuItem.hover(
				function() {
					$(this).children("div.menu").show();
				}, function() {
					$(this).children("div.menu").hide();
				}
			);

		});
	</script>
	<body>
		<#include "common/header.ftl">

		<div class="container index">
			<div class="row">
				<div class="span2">
						<div id="productCategoryMenu" class="productCategoryMenu">
							<ul>
								<@rootCategory>
									<#list root as category >
										<li>
											<div class="item">
												<div>
													<@childrenCategory parentId=category.id limit=3 >
														<#list children as childCategory>
															<a href="./goods/list/${childCategory.id}">
																<strong>${childCategory.name}</strong>
															</a>
														</#list>
													</@childrenCategory>
												</div>
												<div>
													<a href="./brand/content/1">苹果</a>
													<a href="./brand/content/2">三星</a>
													<a href="./brand/content/3">索尼</a>
													<a href="./brand/content/4">华为</a>
												</div>
											</div>
											<div class="menu" style="display: none;">
												<@childrenCategory parentId=category.id>
													<#list children as child >
														<dl class="clearfix <#if child?is_last>last</#if>">
															<dt>
																<a href="./goods/list/${child.id}">${child.name}</a>
															</dt>
															<@childrenCategory parentId=child.id>
																<#list children as third >
																	<dd>
																		<a href="./goods/list/${third.id}">${third.name}</a> <#if third?has_next>|</#if>
																	</dd>
																</#list>
															</@childrenCategory>
														</dl>
													</#list>
												</@childrenCategory>
												<div class="auxiliary">
													<div>
														<strong>推荐品牌</strong>
														<a href="./brand/content/1">苹果</a>
														<a href="./brand/content/2">三星</a>
														<a href="./brand/content/3">索尼</a>
														<a href="./brand/content/4">华为</a>
														<a href="./brand/content/5">魅族</a>
														<a href="./brand/content/6">佳能</a>
														<a href="./brand/content/7">尼康</a>
														<a href="./brand/content/8">松下</a>
													</div>
													<div>
														<strong>热点促销</strong>
														<a href="./promotion/content/1" title="iPhone促销专场">
															<img src="./images/0a1ceb47-f51c-4dfb-9d51-cb723c2f8e78.jpg" alt="iPhone促销专场">
														</a>
													</div>
												</div>
											</div>
										</li>
									</#list>
								</@rootCategory>


							</ul>
						</div>
				</div>
				<div class="span10">
					<div id="slider" class="slider nivoSlider">
						<a href="./promotion/content/2" class="nivo-imageLink" style="display: none;">
							<img src="./images/7a09df9e-3f64-4670-82c2-87f3fd0bec0b.jpg" alt="联想笔记本专场" title="联想笔记本专场" style="display: none;">
						</a>
						<a href="#" class="nivo-imageLink" style="display: none;">
							<img src="./images/313597c4-10be-41a6-8827-9b75889ad88a.jpg" alt="苹果产品专场" title="苹果产品专场" style="width: 1000px; visibility: hidden; display: inline;">
						</a>
						<a href="#" class="nivo-imageLink" style="display: block;">
							<img src="./images/f675047e-91ec-46ac-a718-6c003fc9b901.jpg" alt="情人节专场" title="情人节专场" style="width: 1000px; visibility: hidden; display: inline;">
						</a>
					<img class="nivo-main-image" src="./images/f675047e-91ec-46ac-a718-6c003fc9b901.jpg" style="display: inline; height: auto; width: 1000px;"><div class="nivo-caption" style="display: block;">情人节专场</div><div class="nivo-directionNav"><a class="nivo-prevNav">Prev</a><a class="nivo-nextNav">Next</a></div></div><div class="nivo-controlNav"><a class="nivo-control" rel="0">1</a><a class="nivo-control" rel="1">2</a><a class="nivo-control active" rel="2">3</a></div>
				</div>
			</div>

			<#include "common/ad.ftl">

			<#include "common/brand.ftl">
		</div>

		<#include "common/footer.ftl">
	</body>
</html>